<template>
  <header class="header">
    <h1>小黑记事本</h1>
    <input
     @keyup.enter="addTask"
     placeholder="请输入任务" 
     class="new-todo" 
     v-model.trim="TodoName"
     />
    <button @click="addTask" class="add">添加任务</button>
  </header>

</template>

<script>
export default {
  // 数据收集  所以要设置 TodoName
data(){
  return {
    TodoName:'',
  }
},
// 点击后，提醒父级数据修改  别把修改值带上   写法为$emit('类名'，修改提交的值)
methods:{
  addTask(){
    this.$emit('addTodoName',this.TodoName)
    // 并清空 输入的数据
    this.TodoName=''
  }
}
}

</script>

<style>

</style>